---
id: use-current-breakpoint
title: useCurrentBreakpoint
---

`useCurrentBreakpoint` returns the current breakpoint value.

### TypeScript

```typescript
declare const useCurrentBreakpoint: () => string
```

### ReScript

```typescript
let useCurrentBreakpoint: unit => string
```

### Basic usage

```jsx live showCode
const DebugText = () => {
  const currentBreakpoint = useCurrentBreakpoint()

  return (
    <Typography variant="body">{currentBreakpoint} → resize a browser window to see changes</Typography>
  )
}

const App = () => {
  return (
    <StacksProvider breakpoints={[
      ['mobile', 480],
      ['tablet', 768],
      ['desktop', 992],
      ['large-desktop', 1200],
      ['extra-large-desktop', 1440]
    ]}>
      <DebugText />
    </StacksProvider>
  )
}

render(<App />)
```
